@media (max-width: 1900px) {
  svg {
    width: 85%;
  }
  .header-top {
    left: 45%;
  }
  .header__card-row {
    width: 70%;
    height: 100%;
    & .header__card-column .header__card-box {
      width: 300px;
      min-height: 500px;
      padding: 20px;
    }
    & .header__card-column .header__card-box .header__card-btn {
      margin-top: -20px;
    }
  }
}

@media (max-width: 1899px) {
  .aside-panel {
    &__items .aside-panel__item + .aside-panel__item {
      margin-top: 15px;
    }
  }
}

@media (max-width: 1600px) {
  svg {
    height: 350px;
  }
  video {
    width: 120%;
    height: 100vh;
  }
  .header__card-row {
    top: 40%;
    height: 60%;
    & .header__card-column .header__card-box {
      width: 220px;
      min-height: 360px;
      padding: 10px 0;
    }
    & .header__card-column .header__card-box .header__card-btn {
      font-size: 13px;
      padding: 5px 15px;
    }
    & .header__card-column .header__card-box .header__card-title h4 {
      font-size: 20px;
      line-height: 30px;
    }
    & .header__card-column .header__card-box .header__card-logo .fas,
    & .header__card-column .header__card-box .header__card-logo .fab,
    &
      .header__card-column
      .header__card-box
      .header__card-logo
      .header__card-domain {
      margin-top: 15px;
      font-size: 40px;
    }
    & .header__card-column .header__card-box .header__card-option ul li {
      padding: 5px 0;
    }
  }
  .aside-panel__controls {
    bottom: 40px;
  }
}

@media (max-width: 1366px) {
  svg {
    height: 310px;
    font-size: 170px;
  }
  .header__card-row {
    top: 38%;
    height: 62%;
  }
}

@media (max-width: 1250px) {
  body {
    overflow-y: visible;
  }
  svg {
    width: 100%;
  }
  video {
    height: 100%;
  }
  .aside-panel {
    position: fixed;
    height: 100%;
  }
  .header-top {
    left: 50%;
  }
  .header__card-row {
    width: 100%;
    height: 100%;
    flex-wrap: wrap;
    left: 8%;
  }
}

@media (max-width: 1100px) {
  body {
    background-color: rgb(51, 49, 50);
  }
  .header__card-row {
    display: block;
    width: 100%;
    top: 40%;
    & .header__card-column {
      padding: 50px 0px;
    }
  }
  .header__card-column + .header__card-column {
    margin-left: 0;
  }
}

@media (max-width: 1024px) {
  .header__card-row {
    top: 25%;
  }
}

@media (max-width: 1000px) {
  video {
    display: none;
  }
  svg {
    display: none;
  }
  .header__card-row {
    top: 15%;
  }
  .aside-panel {
    &__items {
      display: none;
    }
    &__controls {
      display: none;
    }
  }
  .header-top__status {
    display: none;
  }
  .header-top__title {
    display: block;
  }
}

@media (max-width: 414px) {
  .header-top__title {
    top: 35px;
    left: -25%;
  }
}

@media (max-width: 320px) {
  .header__card-row {
    left: 13%;
  }
}
